<template>
  <div class="monitor-error" v-show="visible">
    <p>监控异常</p>
    <p>监控名称：{{ name }}</p>
    <p>监控编码：{{ code }}</p>
  </div>
</template>

<script>
export default {
  props: {
    visible: {
      type: Boolean,
      default: () => {
        return false
      }
    },
    name: {
      type: String,
      default: () => {
        return ''
      }
    },
    code: {
      type: String,
      default: () => {
        return ''
      }
    }
  }
}
</script>

<style lang="scss" scoped>
.monitor-error {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: #000;
  color: #fff;
  font-size: 1em;
  padding: 0 1em;
  z-index: 1999;
  p {
    margin-block-start: 0.5em;
    margin-block-end: 0.5em;
  }
}
</style>
